<a routerLink="/company/edit" class="oc-add-btn" [mdl-tooltip]="'添加公司'" mdl-button mdl-button-type="fab" mdl-colored="accent"
  mdl-ripple>
  <mdl-icon>add</mdl-icon>
</a>
<div class="data-table-container">
  <div class="search-box mdl-shadow--2dp">
    <div class="search-wrap mdl-grid">
      <mdl-select *ngIf="!isUserProperty" class="mdl-cell mdl-cell--3-col" label="选择项目" floating-label [(ngModel)]="selected.project"
        (change)="projectChange()">
        <mdl-option *ngFor="let p of projects" [value]="p.id">{{p.name}}</mdl-option>
      </mdl-select>
      <mdl-select class="mdl-cell mdl-cell--3-col" label="选择塔楼" floating-label [(ngModel)]="selected.building" (change)="buildingChange()">
        <mdl-option *ngFor="let p of buildings" [value]="p.id">{{p.buildingAlias || p.buildingNumber}}</mdl-option>
      </mdl-select>
      <mdl-select class="mdl-cell mdl-cell--3-col" label="选择楼层" floating-label [(ngModel)]="selected.floor" (change)="floorChange()">
        <mdl-option *ngFor="let p of floors" [value]="p.id">{{p.index}}</mdl-option>
      </mdl-select>
      <mdl-select class="mdl-cell mdl-cell--3-col" label="选择单元" floating-label [(ngModel)]="selected.unit" (change)="unitChange()">
        <mdl-option *ngFor="let p of units" [value]="p.id">{{p.name}}</mdl-option>
      </mdl-select>
    </div>
    <button mdl-button (click)="clearFileter()">重置</button>
  </div>
  <ngx-datatable [rows]="rows" [columns]="columns" [headerHeight]="40" [rowHeight]="40" [columnMode]="'force'" [headerHeight]="50"
    [footerHeight]="50" [rowHeight]="'auto'" [externalPaging]="true" [messages]="pagerMessage" [count]="count" [offset]="offset"
    [loadingIndicator]="isPageLoading" [limit]="limit" (page)='onPage($event)' class="material fullscreen">

    <ngx-datatable-column name="locations" *ngIf="IsRoot">
      <ng-template let-column="column" ngx-datatable-header-template>
        项目名称
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        {{ parseProjects(value) }}
      </ng-template>
    </ngx-datatable-column>
    <ngx-datatable-column name="name">
      <ng-template let-column="column" ngx-datatable-header-template>
        公司名称
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        {{ value }}
      </ng-template>
    </ngx-datatable-column>
    <ngx-datatable-column name="phone">
      <ng-template let-column="column" ngx-datatable-header-template>
        电话
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        {{ value }}
      </ng-template>
    </ngx-datatable-column>
    <ngx-datatable-column name="hasCount">
      <ng-template let-column="column" ngx-datatable-header-template>
        有照片人数
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        {{ value }}
      </ng-template>
    </ngx-datatable-column>
    <ngx-datatable-column name="staffCount">
      <ng-template let-column="column" ngx-datatable-header-template>
        总人数
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        {{ value }}
      </ng-template>
    </ngx-datatable-column>
    <!-- <ngx-datatable-column name="locations">
      <ng-template let-column="column" ngx-datatable-header-template>
        所属楼层
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        {{ value.length ? value[0].floor.alias : '' }}
      </ng-template>
    </ngx-datatable-column> -->
    <ngx-datatable-column name="locations">
      <ng-template let-column="column" ngx-datatable-header-template>
        位置
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        <p [innerHTML]="ParseLocationInfo(value)"></p>
      </ng-template>
    </ngx-datatable-column>
    <ngx-datatable-column name="id">
      <ng-template let-column="column" ngx-datatable-header-template>
        操作
      </ng-template>
      <ng-template let-value="value" ngx-datatable-cell-template>
        <a routerLink="/company/edit/{{ value }}" class="table-action-btn">
          <i class="material-icons">edit</i>
        </a>
        <a (click)="delete(value)" class="table-action-btn app-delete-btn">
          <i class="material-icons">delete</i>
        </a>
      </ng-template>
    </ngx-datatable-column>
  </ngx-datatable>
</div>